import React, { useState, useEffect } from 'react'
import { useLocation, useNavigate } from 'react-router-dom';
import { Form, Input, InputNumber, Select, message, Upload, Button } from 'antd';
import ContentTitle from "@/components/contentTitle/ContentTitle";
import { getOrderDetail,updateOrder } from '@/api/order';

const {Option } = Select;
export default function OrderEdit() {
    const navigate = useNavigate();
    const { state } = useLocation();
    const [data, setData] = useState({
        key: '1',
        id: '1',
        orderNo: '',
        orderTime: '2021-01-01 12:00:00',
        phone: '123456789',
        consignee: '张三',
        deliverAddress: '',
        deliveryTime: '2021-01-01 12:00:00',
        remarks: '',
        orderAmount: '',
        orderState: ''
    });
    const getInfo = async () => {
        const res = await getOrderDetail({ id: state.id });
        setData(res.data)
    }
    useEffect(() => {
        getInfo();
    }, [])
    const onFinish =async (values) => {
        values = { ...values, id: state.id }
        const {code,msg} = await updateOrder(values);
        if(code === 0){
            message.success(msg);
            navigate('/home/orderList')
        }else{
            message.error(msg);
        }
    }
    return (
        <>
            <ContentTitle title="订单编辑" />
            {
                data.orderNo !== '' ?
                    <Form
                        name='oderEdit'
                        initialValues={data}
                        style={{ marginTop: 20, width: '100%' }}
                        onFinish={onFinish}
                    >
                        <Form.Item label="订单号" name={"orderNo"} style={{ height: 40 }}>
                            <Input style={{ height: 40 }} />
                        </Form.Item >
                        <Form.Item label="下单时间" name={"orderTime"} style={{ height: 40 }}>
                            <Input style={{ height: 40 }} />
                        </Form.Item>
                        <Form.Item label="联系电话" name={"phone"} style={{ height: 40 }}>
                            <Input style={{ height: 40 }} />
                        </Form.Item>
                        <Form.Item label="收货人" name={"consignee"} >
                            <Input style={{ height: 40 }} />
                        </Form.Item>
                        <Form.Item label="送货地址" name={"deliverAddress"} style={{ width: '100%' }}>
                            <Input style={{ height: 40 }} />
                        </Form.Item>
                        <Form.Item label="送达时间" name={"deliveryTime"} style={{ width: '100%' }}>
                            <Input style={{ height: 40 }} />
                        </Form.Item>
                        <Form.Item label="备注" name={"remarks"} style={{ width: '100%' }}>
                            <Input style={{ height: 40 }} />
                        </Form.Item>
                        <Form.Item label="订单金额" name={"orderAmount"} style={{ width: '100%' }}>
                            <Input style={{ height: 40 }} />
                        </Form.Item>
                        <Form.Item label="订单状态" name={"orderState"} style={{ width: '300px' }}>
                            <Select >
                                <Option value='已受理'></Option>
                                <Option value='派送中'></Option>
                                <Option value='已完成'></Option>
                            </Select>
                        </Form.Item>
                        <Form.Item>
                            <Button type="primary" htmlType="submit" style={{ height: '40px', marginLeft: '70px' }}>
                                立即修改
                            </Button>
                        </Form.Item>
                    </Form> : ''
            }
        </>
    )
}
